App = {}
App.MainSidebar = Backbone.View.extend({
	el: $('#sidebar-accordion'),
	initialize: function() {
		this.render();
	},
	events: {
		'click .select-tab': 'select_tab'
	},
	select_tab: function(e) {
		this.options.parent.message_broker({
			message: 'click_tab_item',
			item   : $(e.currentTarget).attr('rel')
		});
	},
	render: function() {
		this.$el.wijaccordion();
	}
});
App.MainTabView = Backbone.View.extend({
	el: '#main-content',
	initialize: function() {
		this.render();
	},

	render: function() {
		this.$el.wijtabs({
			alignment: 'bottom'
		});
	},
	change_tab: function(index) {
		this.$el.wijtabs('select', index);
	}
});
App.MainGridView = Backbone.View.extend({
	el: $('#main-grid'),

	initialize: function() {
		var self = this;
		this.render();
	},
	render: function() {
      this.$el.wijgrid({
         allowSorting: true,
         //allowPaging: true,
			//showFilter: true,
			//showFooter: true,
			//allowResize: true,
         pageSize: 20,
			pagerSettings: {
				mode: 'nextPreviousFirstLast',
				position: 'top'
			},
         data: [
            [27, 'Canada', 'Adams, Craig', 'RW'],
            [43, 'Canada', 'Boucher, Philippe', 'D', 'R'],
            [24, 'Canada', 'Cooke, Matt', 'LW', 'L'],
            [87, 'Canada', 'Crosby, Sidney (C)', 'C', 'L'],
            [1, 'United States', 'Curry, John', 'G', 'L'],
            [27, 'Canada', 'Adams, Craig', 'RW'],
            [43, 'Canada', 'Boucher, Philippe', 'D', 'R'],
            [24, 'Canada', 'Cooke, Matt', 'LW', 'L'],
            [87, 'Canada', 'Crosby, Sidney (C)', 'C', 'L'],
            [1, 'United States', 'Curry, John', 'G', 'L'],
            [27, 'Canada', 'Adams, Craig', 'RW'],
            [43, 'Canada', 'Boucher, Philippe', 'D', 'R'],
            [24, 'Canada', 'Cooke, Matt', 'LW', 'L'],
            [87, 'Canada', 'Crosby, Sidney (C)', 'C', 'L'],
            [1, 'United States', 'Curry, John', 'G', 'L'],
            [27, 'Canada', 'Adams, Craig', 'RW'],
            [43, 'Canada', 'Boucher, Philippe', 'D', 'R'],
            [24, 'Canada', 'Cooke, Matt', 'LW', 'L'],
            [87, 'Canada', 'Crosby, Sidney (C)', 'C', 'L'],
            [1, 'United States', 'Curry, John', 'G', 'L'],
            [27, 'Canada', 'Adams, Craig', 'RW'],
            [43, 'Canada', 'Boucher, Philippe', 'D', 'R'],
            [24, 'Canada', 'Cooke, Matt', 'LW', 'L'],
            [87, 'Canada', 'Crosby, Sidney (C)', 'C', 'L'],
            [1, 'United States', 'Curry, John', 'G', 'L'],
            [27, 'Canada', 'Adams, Craig', 'RW'],
            [43, 'Canada', 'Boucher, Philippe', 'D', 'R'],
            [24, 'Canada', 'Cooke, Matt', 'LW', 'L'],
            [87, 'Canada', 'Crosby, Sidney (C)', 'C', 'L'],
            [1, 'United States', 'Curry, John', 'G', 'L'],
            [27, 'Canada', 'Adams, Craig', 'RW'],
            [43, 'Canada', 'Boucher, Philippe', 'D', 'R'],
            [24, 'Canada', 'Cooke, Matt', 'LW', 'L'],
            [87, 'Canada', 'Crosby, Sidney (C)', 'C', 'L'],
            [1, 'United States', 'Curry, John', 'G', 'L'],
            [27, 'Canada', 'Adams, Craig', 'RW'],
            [43, 'Canada', 'Boucher, Philippe', 'D', 'R'],
            [24, 'Canada', 'Cooke, Matt', 'LW', 'L'],
            [87, 'Canada', 'Crosby, Sidney (C)', 'C', 'L'],
            [1, 'United States', 'Curry, John', 'G', 'L'],
            [27, 'Canada', 'Adams, Craig', 'RW'],
            [43, 'Canada', 'Boucher, Philippe', 'D', 'R'],
            [24, 'Canada', 'Cooke, Matt', 'LW', 'L'],
            [87, 'Canada', 'Crosby, Sidney (C)', 'C', 'L'],
            [1, 'United States', 'Curry, John', 'G', 'L'],
            [27, 'Canada', 'Adams, Craig', 'RW'],
            [43, 'Canada', 'Boucher, Philippe', 'D', 'R'],
            [24, 'Canada', 'Cooke, Matt', 'LW', 'L'],
            [87, 'Canada', 'Crosby, Sidney (C)', 'C', 'L'],
            [1, 'United States', 'Curry, John', 'G', 'L'],
            [27, 'Canada', 'Adams, Craig', 'RW'],
            [43, 'Canada', 'Boucher, Philippe', 'D', 'R'],
            [24, 'Canada', 'Cooke, Matt', 'LW', 'L'],
            [87, 'Canada', 'Crosby, Sidney (C)', 'C', 'L'],
            [1, 'United States', 'Curry, John', 'G', 'L'],
            [27, 'Canada', 'Adams, Craig', 'RW'],
            [43, 'Canada', 'Boucher, Philippe', 'D', 'R'],
            [24, 'Canada', 'Cooke, Matt', 'LW', 'L'],
            [87, 'Canada', 'Crosby, Sidney (C)', 'C', 'L'],
            [1, 'United States', 'Curry, John', 'G', 'L'],
            [27, 'Canada', 'Adams, Craig', 'RW'],
            [43, 'Canada', 'Boucher, Philippe', 'D', 'R'],
            [24, 'Canada', 'Cooke, Matt', 'LW', 'L'],
            [87, 'Canada', 'Crosby, Sidney (C)', 'C', 'L'],
            [1, 'United States', 'Curry, John', 'G', 'L'],
            [27, 'Canada', 'Adams, Craig', 'RW'],
            [43, 'Canada', 'Boucher, Philippe', 'D', 'R'],
            [24, 'Canada', 'Cooke, Matt', 'LW', 'L'],
            [87, 'Canada', 'Crosby, Sidney (C)', 'C', 'L'],
            [1, 'United States', 'Curry, John', 'G', 'L'],
            [27, 'Canada', 'Adams, Craig', 'RW'],
            [43, 'Canada', 'Boucher, Philippe', 'D', 'R'],
            [24, 'Canada', 'Cooke, Matt', 'LW', 'L'],
            [87, 'Canada', 'Crosby, Sidney (C)', 'C', 'L'],
            [1, 'United States', 'Curry, John', 'G', 'L'],
            [27, 'Canada', 'Adams, Craig', 'RW'],
            [43, 'Canada', 'Boucher, Philippe', 'D', 'R'],
            [24, 'Canada', 'Cooke, Matt', 'LW', 'L'],
            [87, 'Canada', 'Crosby, Sidney (C)', 'C', 'L'],
            [1, 'United States', 'Curry, John', 'G', 'L']
         ],
         columns: [
            { headerText: "Number" }, 
            { headerText: "Nationality" }, 
            { headerText: "Player" }, 
            { headerText: "Position" }
         ]
      }); 		
	}
});
App.MainView = Backbone.View.extend({
   el: window,
   header_size: 105,
	left_sidebar_size: 300,
	events: {
		'click .select-tab': 'select_tab'
	},
   initialize: function() {
      var self = this;
		//$('.select-tab').on('click', this.select_tab, self);
      $(window).bind('resize.app', _.bind(self.resize, self));

      this.render();
   },
	message_broker: function(message) {
		switch (message.message) {
			case 'click_tab_item':
				this.Tab.change_tab(message.item);
			break;
		}
	},
	select_tab: function(e) {
		console.log(self);
		//this.Tab.change_tab($(e.currentTarget).attr('rel'));
	},
	resize: function() {

   },
   render: function() {
		var self = this;
      this._render_layout();
		this.Sidebar = new App.MainSidebar({parent: self});
		this.Tab     = new App.MainTabView();
      this.Grid    = new App.MainGridView();
		/*
      $('#main-container').wijsuperpanel({
         keyboardSupport: true,
         vScroller: {
            scrollMode: 'scrollbar'
         }
      });
      */

	},
   _render_layout: function() {
      var self = this;
		$('body').layout({
         applyDefaultStyles: false,
         north__size: self.header_size,
         north__maxSize: self.header_size,
         north__minSize: self.header_size,
         north__closable: false,
			west__size: self.left_sidebar_size,
         north__resizable: false
			//onresize_end: self.resize2
      });
   },
   _render_grid: function() {

   }
});

App.Main = new App.MainView;
	